// components/todolist/todolist-list.ts
interface IStringKey<T = any> {
  [index: string]: T
}

Component({
  /**
   * 组件的属性列表
   */
  properties: {
    listData: {
      type: Array,
    },
  },
  /**
   * 组件的初始数据
   */
  data: {
    selectedIds: {},
    type: "1",
    tableData: [{}],
    left: 0,
  },

  /**
   * 组件的方法列表
   */
  methods: {
    handleDeleteRow(e:WechatMiniprogram.BaseEvent) {
      const id = e.currentTarget.dataset.id;
      this.triggerEvent("deleteRow",id);
    },
    handleCheck(e:WechatMiniprogram.CheckboxGroupChange) {
      const value = e.detail.value;
      // console.log("e.detail = ",e.detail);
      const selectedIds:IStringKey<boolean> = {};
      for (let v of value) {
        selectedIds[v] = true;
      }
      // console.log("selectedIds = ",selectedIds);
      this.setData({selectedIds});
    },
    handleType(e:WechatMiniprogram.BaseEvent) {
      const value = e.currentTarget.dataset.type;
      this.setData({type:value});
    },
    // 删除选中
    handleDelete() {
      // 触发自定义事件，让父组件完成删除
      this.triggerEvent("delete", this.data.selectedIds);
      this.setData({selectedIds: {}});
    }
  },
  // 相当于vue的watch，可以用它来模拟computed
  observers: {
    "type": function(newVal) {
      switch(newVal) {
        // 选中
			case "3": {
				const result = this.properties.listData.filter(
					(v1: any) => this.data.selectedIds[v1.id]
        );
        this.setData({tableData:result});
        break;
			}
			// 未选中
			case "2": {
        const result = this.properties.listData.filter(
					(v1: any) => !this.data.selectedIds[v1.id]
        );
        this.setData({tableData:result});
        break;
			}
			default:
				this.setData({tableData:this.properties.listData});
      }
    },
    "listData": function(newVal) {
     this.setData({tableData:newVal});
    },
    "selectedIds": function(newVal) {
      this.setData({left: Object.keys(newVal).length});
    }
  }
})
